<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>CRUD</title>
    <script src="/day01_eesy_vuejsdemo/js/vuejs-2.5.16.js"></script>
    <script src="/day01_eesy_vuejsdemo/js/axios-0.18.0.js"></script>
</head>
<body>
    <div id="app">
        <table border="1">
            <tr>
                <td>ID</td>
                <td>姓名</td>
                <td>密码</td>
                <td>年龄</td>
                <td>性别</td>
                <td>邮箱</td>
            </tr>
            <tr v-for="u in userList">
                <td>{{u.id}}</td>
                <td>{{u.username}}
                <td>{{u.password}}</td>
                <td>{{u.sex}}</td>
                <td>{{u.age}}</td>
                <td class="text-center">{{u.email}}</td>
                <td>
                    <button type="button" @click="deleteById(u.id)">删除</button>
                    <button type="button" @click="edit(u)">编辑</button>
                </td>
            </tr>

        </table>

        <div>
            <input type="hidden" v-modle="user2.id" value="">
            Username:<input type="text" v-model="user2.username"><br>
            password:<input type="text" v-model="user2.password"><br>
            age:<input type="text" v-model="user2.age"><br>
            sex:<input type="text" v-model="user2.sex"><br>
            email:<input type="text" v-model="user2.email"><br>
            <button type="button" @click="insertUser(user2)">增加</button>
       </div>
        <br><br>
        <div>
            输入ID查询用户<input type="text" v-model="user3.id" >
            <button type="button" @click="findById(user3.id)">查询</button>
            <tr>
                <td>{{user3.id}}</td>
                <td>{{user3.username}}
                <td>{{user3.password}}</td>
                <td>{{user3.sex}}</td>
                <td>{{user3.age}}</td>
                <td class="text-center">{{user3.email}}</td>
            </tr>
        </div>
        <br><br>
        <div id="update">
            <tr>
                <input type="hidden" v-modle="user4.id" >
                Username:<input type="text" v-model="user4.username"><br>
                password:<input type="text" v-model="user4.password"><br>
                age:<input type="text" v-model="user4.age"><br>
                sex:<input type="text" v-model="user4.sex"><br>
                email:<input type="text" v-model="user4.email"><br>
                <button type="button" @click="update(user4)">更新</button>
            </tr>
        </div>

    </div>
    <script src="/day01_eesy_vuejsdemo/js/user1.js"></script>
    <script>

    </script>
</body>


</html>